/*
 * @Author: your name
 * @Date: 2021-01-25 15:05:15
 * @LastEditTime: 2021-01-26 11:02:57
 * @FilePath: \flutter_study\lib\pages\sliver_demo.dart
 */
import 'dart:ui';

import 'package:flutter/material.dart';
import '../mock/posts.dart';

class SliverDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollViewDemo(),
    );
  }
}

// CustomScrollView 自定义滚动视图
class CustomScrollViewDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      scrollDirection: Axis.vertical,
      slivers: <Widget>[
        SliverAppBarDemo(),
        SliverPadding(
          padding: EdgeInsets.all(8.0),
          sliver: SliverListDemo(),
        ),
      ],
    );
  }
}

// SlverGrid 网格布局
class SliverGridDemo extends StatelessWidget {
  Widget _sliverGridBuildItem(BuildContext context, int index) {
    return Image.network(
      posts[index].imageUrl,
      fit: BoxFit.cover,
    );
  }

  @override
  Widget build(BuildContext context) {
    return SliverGrid(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2, mainAxisSpacing: 8.0, crossAxisSpacing: 8.0),
      delegate: SliverChildBuilderDelegate(_sliverGridBuildItem,
          childCount: posts.length),
    );
  }
}

// SliverList 列表视图
class SliverListDemo extends StatelessWidget {
  Widget _sliverGridBuildItem(BuildContext context, int index) {
    return Container(
      margin: EdgeInsets.only(bottom: 10.0),
      decoration: BoxDecoration(borderRadius: BorderRadius.circular(8.0)),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(8.0),
        child: Image.network(posts[index].imageUrl),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return SliverList(
      delegate: SliverChildBuilderDelegate(_sliverGridBuildItem,
          childCount: posts.length),
    );
  }
}

// SliverAppBar 顶部信息栏
class SliverAppBarDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SliverAppBar(
      //   title: Text("SliverAppBar"), // 标题内容
      //   centerTitle: true, // 标题内容是否居中
      elevation: 0.0, // 标题栏底部阴影
      pinned: false, // 是否固定标题栏
      floating: false, // 标题栏悬浮
      //   backgroundColor: Colors.pink,
      expandedHeight: 180.0, // 可伸缩的标题栏高度
      leading: null,
      flexibleSpace: FlexibleSpaceBar(
        // title: Text(
        //   "SliverAppBar",
        //   style: TextStyle(fontSize: 16.0, color: Colors.white),
        // ),
        // centerTitle: true, // 标题内容是否居中
        background: Image.network(
          "https://resources.ninghao.org/images/space-skull.jpg",
          fit: BoxFit.cover,
        ),
      ),
    );
  }
}
